<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="format-detection" content="telephone=no" />
    <!-- load css -->
    <link rel="stylesheet" type="text/css" href="../../common/layui/css/layui.css" media="all" />
    <link rel="stylesheet" type="text/css" href="../../common/css/gobal.css" media="all" />
    <link rel="stylesheet" type="text/css" href="../../common/css/animate.css" media="all" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" media="all" />
    <style type="text/css">
        .article-tables {padding-top: 0px;}
        .cms-search-input {padding-right: 15px;}
        .red{color: #FE6738;}
        .green{color: #19A093;}
        .warm{color: #FFB800;}
    </style>
</head>
<body>
<div class="layui-fluid cms-wrapper animated rotateIn">
    <blockquote class="layui-elem-quote">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" name="search" value="" id="search_input" placeholder="请输入文章标题进行查询" class="layui-input cms-search-input">
            </div>
            <a class="layui-btn" data-type="getSelect">查询</a>
        </div>
        <div class="layui-inline">
            <a class="layui-btn layui-bg-blue" data-type="add">添加文档</a>
        </div>
        <div class="layui-inline">
            <a class="layui-btn layui-bg-pale" data-type="tuijian">推荐文章</a>
        </div>
        <div class="layui-inline">
            <a class="layui-btn" data-type="shenhe">审核文档</a>
        </div>
        <div class="layui-inline">
            <a class="layui-btn layui-btn-danger" data-type="del">批量删除</a>
        </div>
        <div class="layui-inline">
            <div class="layui-form-mid layui-word-aux">因时间仓促，本页面先占个坑，新版发布后 开始系统子页逐个更新，毕竟后台基础框架已完成，望大家见谅！(一个人业余时间写太累了)</div>
        </div>
    </blockquote>

    <div class="layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
        <div class="article-tables">
            <table id="article" lay-filter="articles"></table>
        </div>
    </div>
</div>
<script type="text/html" id="articleBar">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="yulan">预览</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script type="text/html" id="titleTpl">
    <a href="{{d.title}}" class="layui-table-link" target="_blank">{{ d.title}}</a>
</script>

<script type="text/html" id="statusTpl">
    {{#  if(d.status === '待审核'){ }}
    <span class="warm">待审核</span>
    {{#  } else if(d.status === '审核通过'){ }}
    <span class="green">审核通过</span>
    {{#  } else { }}
    <span class="red">审核未通过</span>
    {{#  } }}
</script>
<!-- 加载js文件 -->
<script type="text/javascript" src="../../common/layui/layui.js"></script>
<script type="text/javascript" src="../../js/common.js"></script>
<script type="text/javascript">
    layui.use(['layer', 'form', 'table', 'common'], function() {
        var $      = layui.$,
            layer  = layui.layer,
            form   = layui.form,
            table  = layui.table,
            common = layui.common;

        var tableIns = table.render({
            elem: '#article',
            cols: [
                [
                    {checkbox: true,width: 60,fixed: true},
                    {field: 'id',width: 60,title: 'ID',align: 'center',sort: true},
                    {field: 'title',minwidth: 400,title: '文章标题',align: 'left',templet: '#titleTpl'},
                    {field: 'chanel',width: 120,title: '所属栏目',align: 'center'},
                    {field: 'autor',width: 120,title: '作者',align: 'center'},
                    {field: 'status',width: 150,title: '审核状态',align: 'center',templet: '#statusTpl'},
                    {field: 'sendtime',width: 150,title: '发布时间',align: 'center',sort: true},
                    {field: 'pubtime',width: 150,title: '审核时间',align: 'center',sort: true},
                    {title: '常用操作',width: 200,align: 'center',toolbar: '#articleBar',fixed:"right"}
                ]
            ],
            url: '../../datas/article.json',
            page: true,
            even: true
        });
    });
</script>
</body>
</html>